import React from 'react';
function ThirdLogin(props) {
  const loginList = [
    { className: 'wechat', title: '微信' },
    { className: 'QQ', title: 'QQ' },
    { className: 'weibo', title: '微博' }
  ];

  return (
    <div className="thirdLogin">
      <div
        style={{
          position: 'absolute',
          width: '100%',
          top: '-0.4rem',
          lineHeight: '0.8rem',
          textAlign: 'center'
        }}
        className="fnormal"
      >
        第三方登录
      </div>
      <div className="dfrcb wh100">
        {loginList.map((item, index) => {
          return (
            <div key={index} className="dfrc item">
              <div className={`iconfont icon-${item.className}`} />
              <div className="fnormal" style={{ paddingLeft: '0.4rem' }}>
                {item.title}
              </div>
            </div>
          );
        })}
      </div>
    </div>
  );
}
export default ThirdLogin;
